<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>招聘者详情</title>
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_3063638_l4t9o8ly6jq.css">
    <link rel="stylesheet" href="../swiper-8.0.7/swiper8/swiper-bundle.min.css">
    <!-- <link rel="stylesheet" href="../bootstrap-4.6.1-dist/css/bootstrap.min.css"> -->
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/recruiter.css">
</head>

<body>
    <!-- 头部导航栏 -->
    <header class="header">
        <div class="container">
            <!-- 头部品牌logo -->
            <div class="brand">
                <a href="./homepage.html" class="logo">
                    <img src="../imgs/logo.png" alt="" class="logo-img">
                    <h2 class="logo-title">得程</h2>
                </a>
                <div class="recruit">
                    <a href="./homepage.html" class="recruit-txt">进入招聘版</a>
                </div>
            </div>
            <!-- 头部导航栏 -->
            <div class="head-nav">
                <!-- 菜单项 -->
                <ul class="menu">
                    <li class="item"><a href="#" class="item-txt">首页</a></li>
                    <li class="item"><a href="#" class="item-txt">职位</a></li>
                    <li class="item"><a href="#" class="item-txt">公司</a></li>
                </ul>
                <!-- 登录用户信息 -->
                <div class="user-info">
                    <div class="news">
                        <a href="">消息</a>|
                    </div>
                    <div class="resume">
                        <a href="">简历</a>|
                    </div>
                    <div class="deliver">
                        <a href="">投递</a>
                    </div>
                    <!-- 用户信息 -->
                    <div class="user">
                        <div class="user-name">霍美美</div>
                        <ul class="user-menu">
                            <li class="menu-item"><a href="">个人主页</a></li>
                            <li class="menu-item"><a href="">职位收藏</a></li>
                            <li class="menu-item"><a href="">关注公司</a></li>
                            <li class="menu-item"><a href="">账号设置</a></li>
                            <li class="menu-item item-line"></li>
                            <li class="menu-item"><a href="">去招聘版</a></li>
                            <li class="menu-item"><a href="./homepage.html">退出登录</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </header>


    <!-- 招聘者信息概述 -->
    <div class="recruiter-info-box">
        <div class="container">
            <div class="recruiter-info">
                <img src="../imgs/publish-post.png" alt="">
                <div class="recruiter-content">
                    <div class="recruiter-name">
                        <div class="name">李小姐</div>
                        <div class="recruit">[HR]</div>
                    </div>
                    <div class="post-online">
                        <div class="txt">在线职位：</div>
                        <div class="post-num">24</div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!-- 公司详情-基本信息 -->
    <div class="company-details-box">
        <div class="container">
            <!-- 介绍左侧 -->
            <div class="details-left">

                <!-- 在招职位介绍 -->
                <div class="recruiting-post">
                    <ul class="post-info">
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">iOS工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-24 14:34 发布</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">Java开发工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-23 09:45 更新</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">iOS工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-24 14:34 发布</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">Java开发工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-23 09:45 更新</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">iOS工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-24 14:34 发布</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">Java开发工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-23 09:45 更新</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">iOS工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-24 14:34 发布</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">Java开发工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-23 09:45 更新</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">iOS工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-24 14:34 发布</div>
                        </li>
                        <li class="post-list">
                            <div class="company-info">
                                <a href="./jobdetails.html" class="company-title">
                                    <div class="title">Java开发工程师</div>
                                    <div class="pay">[20K-30K]</div>
                                </a>
                                <div class="company-tag">
                                    <div class="tag-item">深圳 南山区</div>|
                                    <div class="tag-item">3-5年</div>|
                                    <div class="tag-item">本科</div>
                                </div>
                            </div>
                            <div class="date">2019-2-23 09:45 更新</div>
                        </li>
                    </ul>
                    <!-- 分页器 -->
                    <ul class="pager">
                        <li class="page-item pre"><a class="page-link" href="javascripr:;">上一页</a></li>
                        <li class="page-item page-num active"><a class="page-link" href="javascripr:;">1</a></li>
                        <li class="page-item page-num"><a class="page-link" href="javascripr:;">2</a></li>
                        <li class="page-item next"><a class="page-link" href="javascripr:;">下一页</a></li>
                    </ul>

                </div>
            </div>
            <!-- 介绍右侧 -->
            <div class="details-right">
                <!-- 公司概述 -->
                <div class="company-summary">
                    <a href="./companydetails.html" class="company-title">
                        <img src="../imgs/tengxun-logo.png" alt="">
                        <div class="title">深圳腾讯科技有限公司</div>
                    </a>
                    <div class="line"></div>
                    <ul class="tag">
                        <li class="tag-list">
                            <i class="iconfont icon-fenlei"></i>
                            <div class="list-txt">已上市</div>
                        </li>
                        <li class="tag-list">
                            <i class="iconfont icon-yonghutouxiang"></i>
                            <div class="list-txt">2000人以上</div>
                        </li>
                        <li class="tag-list">
                            <i class="iconfont icon-pinglun"></i>
                            <div class="list-txt">游戏 / 互联网 / 区块链</div>
                        </li>
                        <li class="tag-list">
                            <i class="iconfont icon-wangluo"></i>
                            <div class="list-txt">http://www.tengxun.com</div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>


    <!-- 底部导航栏 -->
    <footer class="footer">
        <div class="container">
            <div class="service">
                <div class="links">
                    <div class="link">
                        <!-- 帮助链接信息 -->
                        <dl class="link-info">
                            <dt class="link-title">关于得程</dt>
                            <dd class="link-item"><a href="#">了解得程</a></dd>
                            <dd class="link-item"><a href="#">得程APP</a></dd>
                            <dd class="link-item"><a href="#">用户协议</a></dd>
                        </dl>
                        <dl class="link-info">
                            <dt class="link-title">帮助与反馈</dt>
                            <dd class="link-item"><a href="#">使用帮助</a></dd>
                            <dd class="link-item"><a href="#">意见反馈</a></dd>
                        </dl>
                        <dl class="link-info">
                            <dt class="link-title">联系我们</dt>
                            <dd class="link-item">4006-345-345</dd>
                            <dd class="link-item">周一至周日 9:00-18:00</dd>
                        </dl>
                    </div>
                    <!-- 图片帮助 -->
                    <div class="contact">
                        <div class="app active">
                            <div class="app-contact">
                                <i class="iconfont icon-app"></i>
                                <div class="txt">下载APP</div>
                            </div>
                            <img src="../imgs/code.png" alt="" class="code">
                        </div>
                        <div class="WeChat">
                            <div class="WeChat-contact">
                                <i class="iconfont icon-gongzhonghao"></i>
                                <div class="txt">关注公众号</div>
                            </div>
                            <img src="../imgs/code.png" alt="" class="code">
                        </div>
                    </div>
                </div>
                <!-- 底部网站信息 -->
                <div class="site-info">
                    <div class="copyright">Copyright©2019 得程</div>
                    <div class="record">备案号：粤ICP备12034550号-1</div>
                    <div class="record-info">
                        <img src="../imgs/record.png" alt="">
                        <div class="record-num">京公网安备11010502032801</div>
                    </div>
                </div>
            </div>
        </div>
    </footer>

    <script src="../js/jquery.slim.min.js"></script>
    <!-- <script src="../bootstrap-4.6.1-dist/js/bootstrap.min.js"></script> -->
    <script src="../swiper-8.0.7/swiper8/swiper-bundle.min.js"></script>

    <script>
        $(function () {
            // 用户信息的显示与隐藏
            $('.user').on('mouseenter mouseleave', function () {
                $(this).find('.user-menu').toggle(1000);
            });

            // 关注按钮的单击效果
            $('.follow').on('click', function () {
                $(this).toggleClass('active');
            });


            // 公司地址信息的显示与隐藏
            $('.active-address').on('click', function () {
                $(this).siblings('.select-address').toggle(1000);
            });
            // 选择地址
            $('.select').on('click', function () {
                //蓝点
                $('.select').empty();
                $(this).append('<div class="selectd"></div>');

                //选择公司显示
                let html = $(this).parent().clone().html();
                // console.log(html);
                html += '<img src="../imgs/little-down-arrow.png" alt="" class="little-down-arrow">';
                $('.active-address').empty().append(html);
            });


            // 显示当前图片数量
            setInterval(function () {
                let html = $('.swiper-pagination').clone().html();
                console.log(html);
                $('.picture-num').empty().append(html);
            }, 500)


            // 分页器的单击效果
            $('.page-num').on('click', function () {
                $('.page-num').removeClass("active")
                $(this).addClass("active");
            });
            $('.page-item.pre').on('click', function () {
                let index = $('.page-num.active').index();
                index = index - 1;
                index - 1 < 0 ? index = 0 : index = index - 1;
                $('.page-num').removeClass("active")
                $('.page-num').eq(index).addClass("active")
            });
            $('.page-item.next').on('click', function () {
                let bigIndex = $('.page-num').index();

                console.log(bigIndex);
                let index = $('.page-num.active').index();
                index + 1 > bigIndex ? index : index = index + 1;
                $('.page-num').removeClass("active")
                $('.page-num').eq(index).addClass("active")
            });

            // 底部二维码图片显示
            $('.app-contact').on({
                mouseenter: function () {
                    $(this).parent().addClass("active");
                    $('.WeChat-contact').parent().removeClass("active");
                }
            });
            $('.WeChat-contact').on({
                mouseenter: function () {
                    $(this).parent().addClass("active");
                    $('.app-contact').parent().removeClass("active");
                }
            });
        });

        //右侧公司相册轮播图
        var swiper = new Swiper(".mySwiper", {
            loop: true,
            // 轮播功能
            autoplay: {
                delay: 3000,
                stopOnLastSlide: false,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".swiper-pagination",
                type: "fraction",
            },
            navigation: {
                nextEl: ".swiper-button-next",
                prevEl: ".swiper-button-prev",
            },
            // Enable debugger
            debugger: true,
        });



    </script>
</body>

</html>